<template>
	<view class="friend-item u-flex u-flex-nowrap u-row-around u-padding-35"  hover-class="active" hover-stay-time="150" @click="clickItem">
		<view class="left-wr u-flex-1">
			<u-avatar :src="avatarSrc"></u-avatar>
		</view>
		<view class="right-wr u-flex-4">
			<view class="r-top u-flex u-flex-nowrap u-row-between">
				<view class="name u-font-40">{{item.nick}}</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	props:{
		item:Object,
	},
	computed:{
		avatarSrc(){
			return this.item.avatar||'/static/images/avatar.webp'
		}
	},
	data(){
		return {
			
		}
	},
	methods:{
		clickItem(){
			uni.navigateTo({
			   url: `/pages/chat?account=${this.item.account}&nickName=${this.item.nick}`
			})
		}
	}
}
</script>

<style lang="scss">
.friend-item{
	width: 100%;
	box-sizing: border-box;
	border: 2rpx solid rgba(209, 213, 219,0.5);
	border-radius: 5rpx;
	&.active{
		background-color: rgba(229, 231, 235, 0.5);
	}
	.left-wr{
		
	}
	.right-wr{
		.r-top{
			.name{
				
			}
			.time{
				color: #6B7280;
			}
		}
		
	}
}
</style>
